<!DOCTYPE html>
<html lang="ch">
<head>
    <meta charset="UTF-8"/>
    <title>Saas采购申请</title>
    <style type="text/css">
        body
        {
            background-size: cover;
        }
    </style>
    <script type="text/javascript" src="/static/js/form-check.js"></script>

    <script type="text/javascript">
        window.onload = function ()
        {
            var  submit=  document.getElementById("submit");

            var  id=  document.getElementById("id");
            var  sid=  document.getElementById("sid");
            id.onblur = checkId;
            function  checkId()
            {
                return   check(id,sid,"采购订单ID");
            }

            var  supCode=  document.getElementById("supCode");
            var  ssupCode=  document.getElementById("ssupCode");
            supCode.onblur = checksupCode;
            function  checksupCode()
            {
                return   check(supCode,ssupCode,"供应商编码");
            }

            var  supName=  document.getElementById("supName");
            var  ssupName=  document.getElementById("ssupName");
            supName.onblur = checksupName;
            function  checksupName()
            {
                return   check(supName,ssupName,"供应商名称");
            }

            var  person=  document.getElementById("person");
            var  sperson=  document.getElementById("sperson");
            person.onblur = checkperson;
            function  checkperson()
            {
                return   check(person,sperson,"创建人");
            }

            var  desc=  document.getElementById("desc");
            var  sdesc=  document.getElementById("sdesc");
            desc.onblur = checkdesc;
            function  checkdesc()
            {
                return   check(desc,sdesc,"备注");
            }

            var  brand=  document.getElementById("brand");
            var  sbrand=  document.getElementById("sbrand");
            brand.onblur = checkbrand;
            function  checkbrand()
            {
                return   check(brand,sbrand,"品牌");
            }

            var  code=  document.getElementById("code");
            var  scode=  document.getElementById("scode");
            code.onblur = checkcode;
            function  checkcode()
            {
                return   check(code,scode,"商品编码");
            }

            var  creTime=  document.getElementById("creTime");
            var  screTime=  document.getElementById("screTime");
            creTime.onblur = checkcreTime;
            function  checkcreTime()
            {
                return   check(creTime,screTime,"时间");
            }

            var  name=  document.getElementById("name");
            var  sname=  document.getElementById("sname");
            name.onblur = checkname;
            function  checkname()
            {
                return   check(name,sname,"商品名称");
            }


            var  price=  document.getElementById("price");
            var  sprice=  document.getElementById("sprice");
            price.onblur = checkprice;
            function  checkprice()
            {
                return  checkNumber(price,sprice);
            }

            var  count=  document.getElementById("count");
            var  scount=  document.getElementById("scount");
            count.onblur = checkcount;
            function  checkcount()
            {
                return  checkNumber(count,scount);
            }


            /*var  amount=  document.getElementById("amount");
            var  samount=  document.getElementById("samount");
            amount.onblur = checkamount;
            function  checkamount()
            {
                return   check(amount,samount,"总价");
            }*/


            function  check(view,s,text)
            {
                var value = view.value ;
                if(value==null ||value=="" )
                {
                    s.innerHTML=text+"不能为空";
                    view.focus();
                    return  false;
                }
                else
                    {
                    s.innerHTML="";
                    return true;
                }
            }
            /*计算总价*/
            var cprice = document.querySelector('.cprice'),
                ccount = document.querySelector('.ccount'),
                camount = document.querySelector('.camount');
            camount.onclick=function()
            {
                let sum=0;
                let val1=cprice.value;
                let val2=ccount.value;
                if (val1&&val2)
                {
                    sum = val2*val1
                    camount.value=sum
                }
            }


            submit.onclick = function ()
            {
                if (checkId()&&checksupCode()&&checkcreTime()&&checksupName()&&checkperson() &&checkdesc()&&checkbrand() && checkcode() &&checkname()&&checkprice()&&checkcount()&&checkamount())
                {
                    return  true;
                }
                else
                {
                    return  false;
                }
            }
           /* function compute() {
                oSum.value = oPrice.value * oCount.value;
                console.log(oSum.value)
            }*/
        }
    </script>
    <style type="text/css">
        span{
            color:sandybrown;
        }
    </style>


</head>
<body>
<body background="/static/img/buy_SpongeBobSquarePants3.jpeg">
    <input align="left" type="button"  onclick="location.href='/buy/getList'" value="GIVE UP" style="width:100px;height:50px; color:lightseagreen;background-color:#FFCC00;" /><span>
            <h2 style="color:chocolate;" align="left">采购申请</h2>
    </span>

    <form action="/buy/addSingle" method="post">
        <table>
            <tr>
                <td>采购订单ID</td>
                <td>
                    <input type="text" name="id" id="id" placeholder="采购订单ID"><span id="sid"></span>
                </td>
            </tr>
            <tr>
                <td>供应商编码</td>
                <td>
                    <input type="text" name="supCode" id="supCode" placeholder="供应商编码"><span id="ssupCode"></span>
                </td>
            </tr>
            <tr>
                <td>供应商名称</td>
                <td>
                    <input type="text" name="supName" id="supName" placeholder="供应商名称"><span id="ssupName"></span>
                </td>
            </tr>

            <tr>
                <td>付款类型</td>
                <td>
                    <select name="payType">
                        <option value="货到付款">货到付款</option>
                        <option value="预付款">预付款</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>创建人</td>
                <td>
                    <input type="text" name="person" id="person" placeholder="创建人"><span id="sperson"></span>
                </td>
            </tr>
            <tr>
                <td>创建时间</td>
                <td>
                    <input type="date" name="creTime" id="creTime" placeholder="创建时间"><span id="screTime"></span>
                </td>
            </tr>
            <tr>
                <td>备注</td>
                <td>
                    <input type="text" name="desc" id="desc" placeholder="备注"><span id="sdesc"></span>
                </td>
            </tr>
           <#-- <tr>
               &lt;#&ndash; <td>
                    <input type="text" name="payType" placeholder="付款类型">
                </td>&ndash;&gt;
            </tr>-->


            <tr>
                <td>品牌</td>
                <td>
                    <input type="text" name="brand" id="brand" placeholder="品牌"><span id="sbrand"></span>
                </td>
            </tr>
            <tr>
                <td>商品编码</td>
                <td>
                    <input type="text" name="code" id="code" placeholder="商品编码"><span id="scode"></span>
                </td>
            </tr>
            <tr>
                <td>商品名称</td>
                <td>
                    <input type="text" name="name" id="name" placeholder="商品名称"><span id="sname"></span>
                </td>
            </tr>
            <tr>
                <td>进货价</td>
                <td>
                    <input type="text" name="price" id="price" placeholder="进货价" class="cprice"><span id="sprice"></span>
                </td>
            </tr>
            <tr>
                <td>数量</td>
                <td>
                    <input type="text" name="count" id="count" placeholder="数量" class="ccount"><span id="scount"></span>
                </td>
            </tr>
            <tr>
                <td>金额</td>
                <td>
                    <input type="text" name="amount" id="amount" placeholder="总价" class="camount" readonly="true"><span id="samount"></span>
                </td>
            </tr>
        </table>
        <input align="center" type="submit" id="submit" value="SAVE" style="width:18.5%;height:10%; font-size: 80px; color:lightseagreen;background-color:#FFCC00;" />

    </form>
</body>
</html>